<!doctype html>
<html lang="en">
  <head>
    <script type="module" crossorigin src="/frontend-mini-challenges/javascript/assets/index-DZ6LM_7n.js"></script>
    <link rel="modulepreload" crossorigin href="/frontend-mini-challenges/javascript/assets/navbar-PAFhV-cJ.js">
    <link rel="modulepreload" crossorigin href="/frontend-mini-challenges/javascript/assets/header-DIqzw3PH.js">
    <link rel="stylesheet" crossorigin href="/frontend-mini-challenges/javascript/assets/navbar-Dkne97UN.css">
    <link rel="stylesheet" crossorigin href="/frontend-mini-challenges/javascript/assets/header-DAZPOirm.css">
    <link rel="stylesheet" crossorigin href="/frontend-mini-challenges/javascript/assets/index-CRdab_-J.css">
  </head>
  <body>
    <div class="container text-center">
      <form>
        <input type="text" id="userInput" autocomplete="off" placeholder="Type & hit Enter" />
      </form>

      <div class="chips-display"></div>
    </div>
  </body>

  <template id="chipTemplate">
    <div class="chip flex-center">
      <span class="chip-name"></span>
      <button class="remove flex-center">&#x2715;</button>
    </div>
  </template>
</html>
